<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="/jqueryeasyui/jquery.easyui.jsp"%>
<script type="text/javascript">
	$(function() {
		$("#divInfo").panel({
			"title" : "员工信息"
		});
		$("#dialog").dialog({
			"title" : "信息",
			"closed" : true,
			"width" : 200,
			"buttons" : [ {
				"text" : "确定",
				handler : deleteData
			}, {
				"text" : "取消",
				handler : function() {
					$("#dialog").dialog("close");
				}
			} ]
		});

		$("#btnAdd").linkbutton();
		$("#btnAdd")
				.click(
						function() {
							if ($("#dataform").form("validate")) {
								$
										.post(
												"${pageContext.request.contextPath}/Employee_save.action",
												{
													"employeeModel.empName" : $(
															"#empName").val(),
													"employeeModel.info" : $(
															"#info").val(),
													"employeeModel.deptModel.deptId" : $(
															"#deptId")
															.combobox(
																	"getValue")
												}, showMessage, "json");
							}
						});
		
		$("#btnModify").linkbutton();
		$("#btnModify").linkbutton("disable");
		$("#btnModify")
				.click(
						function() {
							if ($("#dataform").form("validate")) {
								$
										.post(
												"${pageContext.request.contextPath}/Employee_modify.action",
												{
													"employeeModel.empId" : $(
															"#empId").val(),
													"employeeModel.empName" : $(
															"#empName").val(),
													"employeeModel.info" : $(
															"#info").val(),
													"employeeModel.deptModel.deptId" : $(
															"#deptId")
															.combobox(
																	"getValue")
												}, showMessage, "json");
							}
						});

		$("#btnCancle").linkbutton();
		$("#btnCancle").linkbutton("disable");
		$("#btnCancle").click(function() {
			$('#dataform').form("clear");
			$("#btnModify").linkbutton("disable");
			$("#btnCancle").linkbutton("disable");
			$("#btnAdd").linkbutton("enable");
		});

		$("#btnClear").linkbutton();
		$("#btnClear").click(function() {
			$('#dataform').form("clear");
		});

		$("#empName").validatebox({
			"required" : true,
			"missingMessage" : "员工姓名必须填写！"
		});
		$("#info").validatebox({
			"required" : true,
			"missingMessage" : "员工简介必须填写！"
		});

		$("#deptId").combobox({
			"url" : "${pageContext.request.contextPath}/Dept_queryAll.action",
			"loadFilter" : function(data) {
				return data.rows;
			},
			"valueField" : "deptId",
			"textField" : "deptName",
			"missingMessage" : "必须选择所属部门！"
		});

		$("#deptId").combobox("setValue", 1);

		$("#grid")
				.datagrid(
						{
							title : "员工信息",
							iconCls : "icon-aibo5",
							nowrap : true,
							autoRowHeight : false,
							collapsible : true,
							url : "${pageContext.request.contextPath}/Employee_queryAll.action",
							idField : "id",
							columns : [ [
									{
										field : "empId",
										title : "编号",
										align : "center",
									},
									{
										field : "empName",
										title : "姓名",
										align : "center",
									},
									{
										field : "info",
										title : "简介",
										align : "center",
									},
									{
										field : "deptModel",
										title : "部门",
										align : "center",
										formatter : function(value, rowData,
												rowIndex) {
											return value.deptId + ":"
													+ value.deptName;
										}
									},
									{
										field : "opt",
										title : "操作",
										align : "center",
										formatter : function(value, rec) {
											var result = "<a href=\"javacript:void(0);\" onclick=\"showDeleteData("
													+ rec.empId
													+ ",'"
													+ rec.empName
													+ "');\">删除</a>";
											console.log(result);
											return result;
										}
									} ] ],
							pagination : true,
							rownumbers : true,
							pageSize : 5,
							pageList : [ 5, 10, 15 ],
							singleSelect : true,
							onDblClickRow : showModifyData
						});

	});

	function showMessage(data) {
		if (data.success) {
			$("#grid").datagrid("reload");
		}
		$("#dialog").dialog("close");
		$.messager.show({
			"title" : "信息",
			"msg" : data.message
		});
	}

	function showDeleteData(empId, empName) {
		$("#dialogInfo").html("是否删除员工:" + empName + "?");
		$("#dialog").dialog("open");
	}

	function deleteData() {
		var selected = $("#grid").datagrid("getSelected");
		$.post("${pageContext.request.contextPath}/Employee_delete.action", {
			"employeeModel.empId" : selected.empId
		}, showMessage, "json");
	}

	function showModifyData() {
		var selected = $("#grid").datagrid("getSelected");
		if (selected) {
			$
					.post(
							"${pageContext.request.contextPath}/Employee_queryByKey.action",
							{
								"employeeModel.empId" : selected.empId
							}, function(data) {
								$("#empId").val(data.data.empId);
								$("#empName").val(data.data.empName);
								$("#info").val(data.data.info);
								$("#deptId").combobox("setValue",
										data.data.deptModel.deptId);
								$("#empName").trigger("focus");
								$("#btnModify").linkbutton("enable");
								$("#btnCancle").linkbutton("enable");
								$("#btnAdd").linkbutton("disable");
							}, "json");
		}
	}
</script>
</head>
<body>
	<div id="divInfo">
		<input type="hidden" id="empId">
		<table id="dataform">
			<tr>
				<td>员工姓名：</td>
				<td><input type="text" id="empName"></td>
				<td>员工部门：</td>
				<td><input type="text" id="deptId"></td>
			</tr>
			<tr>
				<td>员工简介:</td>
				<td colspan="3" align="center"><textarea id="info" rows="5"
						cols="50"></textarea></td>
			</tr>
			<tr>
				<td colspan="4" align="center"><a href="javascript:void(0);"
					id="btnAdd">添加</a> <a href="javascript:void(0);" id="btnModify">修改</a>
					<a href="javascript:void(0);" id="btnCancle">取消</a> <a
					href="javascript:void(0);" id="btnClear">清空</a></td>
			</tr>
		</table>
	</div>
	<br />
	<div id="grid"></div>
	<div id="dialog">
		<p id="dialogInfo"></p>
	</div>
</body>
</html>